<template>
  <view class="container">
    <nut-cell :title="'订单号：' + ordermu" :desc="time"></nut-cell>
    <view class="star">
      服务态度
      <nut-icon name="star-n"></nut-icon>
      <nut-icon name="star-n"></nut-icon>
      <nut-icon name="star-n"></nut-icon>
      <nut-icon name="star-n"></nut-icon>
      <nut-icon name="star-n"></nut-icon>
    </view>
    <view class="star">
      工渠测试
      <nut-icon name="star-n"></nut-icon>
      <nut-icon name="star-n"></nut-icon>
      <nut-icon name="star-n"></nut-icon>
      <nut-icon name="star-n"></nut-icon>
      <nut-icon name="star-n"></nut-icon>
    </view>
    <view class="star">
      产品质量
      <nut-icon name="star-n"></nut-icon>
      <nut-icon name="star-n"></nut-icon>
      <nut-icon name="star-n"></nut-icon>
      <nut-icon name="star-n"></nut-icon>
      <nut-icon name="star-n"></nut-icon>
    </view>
    <view class="star">
      配送速度
      <nut-icon name="star-n"></nut-icon>
      <nut-icon name="star-n"></nut-icon>
      <nut-icon name="star-n"></nut-icon>
      <nut-icon name="star-n"></nut-icon>
      <nut-icon name="star-n"></nut-icon>
    </view>
    <nut-textarea v-model="value" placeholder="评价晒单~" class="text" />
    <view class="submit_button">
      <nut-button
        class=""
        size="large"
        type="primary"
        shape="square"
        color="#DC2734"
        @click="handleGo('')"
        >发表评价
      </nut-button>
    </view>
  </view>
</template>

<script lang="ts">
import { reactive, toRefs } from "vue";
import { ref } from "vue";

export default {
  name: "project-approval",
  components: {},
  setup() {
    const state = reactive({
      ordermu: "GQ-210610-1726-0004",
      time: "2021-10-20",
    });
    const value = ref("");

    return {
      value,
      ...toRefs(state),
    };
  },
};
</script>

<style lang="scss">
.star {
  background-color: #ffffff;
  font-size: 13px;
  font-family: PingFangSC-Regular, PingFang SC;
  font-weight: 400;
  color: #333333;
  line-height: 18px;
  padding-left: 16px;
  padding-top: 12px;
  padding-bottom: 14px;
}

.text {
  margin-top: 2px;
}
</style>